﻿@model UsersViewModel
@{
    ViewBag.Title = "Register account";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>
    Register account</h2>
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)
    <fieldset>
        <div class="editor-label">
            @Html.LabelFor(model => model.Country, null, true)
        </div>
        <div class="editor-field">
            @( Html.Telerik().ComboBoxFor(x => x.CountryID)
                .Name("CountryID")
                .BindTo(new SelectList(Model.Country, "Value", "Text"))
                .Placeholder("Select Country...")
                .SelectedIndex(0)
                .CascadeTo("OfficeID")
                .DropDownHtmlAttributes(new { style = " white-space:nowrap;" })
                .Filterable(filtering => filtering.FilterMode(AutoCompleteFilterMode.Contains))
                .HighlightFirstMatch(true)
                .ClientEvents(events => events.OnChange("ComboBox_onChange"))
            )
            @Html.ValidationMessageFor(model => model.CountryID)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.RegionName, "Region Name")
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.RegionName, new { disabled = "disabled", @readonly = "readonly" })
            @Html.ValidationMessageFor(model => model.RegionName)
        </div>
        @*<div class="editor-label">
            @Html.LabelFor(model => model.OrganizationName, "Organization Name")
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.OrganizationName, new { disabled = "disabled", @readonly = "readonly" })
            @Html.ValidationMessageFor(model => model.OrganizationName)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.DialogPartnerName, "DialogPartner Name")
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(model => model.DialogPartnerName, new { disabled = "disabled", @readonly = "readonly" })
            @Html.ValidationMessageFor(model => model.DialogPartnerName)
        </div>*@
        <div class="editor-label">
            @Html.LabelFor(model => model.Office, null, true)
        </div>
        <div class="editor-field">
            @( Html.Telerik().ComboBoxFor(x => x.OfficeID)
            .Name("OfficeID")
            .DataBinding(binding => binding.Ajax().Select("AjaxGetDropDownListOffice", "Users"))
            .ClientEvents(events => events.OnDataBound("ComboBox_OnDataBound"))
            .Placeholder("Select Office...")
            .SelectedIndex(0)
            .Filterable(filtering => filtering.FilterMode(AutoCompleteFilterMode.Contains))
            .HighlightFirstMatch(true)
            )
            @Html.ValidationMessageFor(model => model.OfficeID)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.LoginName, null, true)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.LoginName)
            @Html.ValidationMessageFor(model => model.LoginName)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Password, null, true)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Password)
            @Html.ValidationMessageFor(model => model.Password)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.ConfirmPassword, null, true)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.ConfirmPassword)
            @Html.ValidationMessageFor(model => model.ConfirmPassword)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.FullName)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.FullName)
            @Html.ValidationMessageFor(model => model.FullName)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.Telephone)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Telephone)
            @Html.ValidationMessageFor(model => model.Telephone)
        </div>
        <div class="editor-label">
            @Html.LabelFor(model => model.MemoryWord, null, true)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.MemoryWord)
            @Html.ValidationMessageFor(model => model.MemoryWord)
        </div>
        <p class="dvbutton">
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}
@*<div>
    @Html.ActionLink("Back to List", "Index")
</div>*@
<script type="text/javascript">
    function ComboBox_OnDataBound() {
        var combobox = $(this).data('tComboBox');
        combobox.enable();
        combobox.value(null);
        combobox.text('Select Office...');
    }

    function ComboBox_onChange() {
        var combobox = $(this).data('tComboBox');
        var cbbVal = combobox.value();        
        $.ajax({
            url: '@Url.Action("AjaxGetCountryROD")',
            type: 'POST',
            data: { CountryID: cbbVal },
            success: function (result) {
                $('#RegionName').val(result.RegionName);
                $('#OrganizationName').val(result.OrganizationName);
                $('#DialogPartnerName').val(result.DialogPartnerName);
            }
        });
    }
</script>
